<!DOCTYPE html>
<html lang="zh">
  <head>
    <meta charset="UTF-8" />
    <meta name="author" content="xmy6364">
    <meta name="description" content="想要成为大佬">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no" />

    <link rel="shortcut icon" href="/assets/favicon.ico" type="image/x-icon">
    <link rel="preconnect" href="https://fonts.gstatic.com">
    <link href="https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@600&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="https://cdn.bootcdn.net/ajax/libs/highlight.js/10.5.0/styles/default.min.css">
    <link rel="stylesheet" href="https://cdn.bootcdn.net/ajax/libs/highlight.js/10.5.0/styles/github-gist.min.css">
    <link rel="stylesheet" href="/assets/lib/css/font-awesome.min.css">
    <link rel="stylesheet" href="/assets/css/layout.css" />
    <script defer src="https://cdn.bootcdn.net/ajax/libs/clipboard.js/2.0.6/clipboard.min.js"></script>
    <script defer src="/assets/js/copyCode.js"></script>
    <script defer src="/assets/js/backTop.js"></script>
    <script defer src="/assets/js/tool.js"></script>

    
  <link rel="stylesheet" href="/assets/css/page.css" />
  <link rel="stylesheet" href="/assets/css/sidebar.css" />
  <link rel="stylesheet" href="/assets/css/footer.css" />
  <link rel="stylesheet" href="/assets/css/post.css" />
  <script defer src="/assets/js/backHome.js"></script>
  <script defer src="/assets/js/toc.js"></script>
  <script defer src="/assets/js/copyright.js"></script>


    <title>关于HTTP</title>
  </head>
  <body>
    <div class="container">
      <aside>
        
  <div class="sidebar">
  <header>梦的博客</header>
  <div class="info">
    <div class="avatar">
      <img src="https://cdn.jsdelivr.net/gh/xmy6364/blog-image/img/pixelartoc_1.png" alt="头像">
    </div>
    <div class="author">xmy6364</div>
    <div class="description">想要成为大佬</div>
    <div class="about">
      <a href="/about">about me.</a>
    </div>
  </div>
  <div class="links">
    <ul>
    
      <li class="links-item">
        <a href="https://github.com/xmy6364" target="_blank">
          <i class="fa fa-github-alt" aria-hidden="true"></i>
        </a>
      </li>
    
      <li class="links-item">
        <a href="tencent://message/?uin=1176281967" target="_blank">
          <i class="fa fa-qq" aria-hidden="true"></i>
        </a>
      </li>
    
    </ul>
  </div>
  <nav>
    <ul>
    
      <li class="nav-item">
        <a href="/archives">
          <span class="nav-item__count">33</span>
          <span class="nav-item__label">归档</span>
        </a>
      </li>
    
      <li class="nav-item">
        <a href="/categories">
          <span class="nav-item__count">2</span>
          <span class="nav-item__label">分类</span>
        </a>
      </li>
    
      <li class="nav-item">
        <a href="/tags">
          <span class="nav-item__count">45</span>
          <span class="nav-item__label">标签</span>
        </a>
      </li>
    
    </ul>
  </nav>
  <div class="catalogue" id="catalogue"></div>
</div>

      </aside>
      <main>
        
  <div class="post">
    <div class="post-front">
      <h1 class="post-front__title">关于HTTP</h1>
      <div class="post-front__desc">
        
        <p class="post-front__desc-date">
          <i class="fa fa-calendar" aria-hidden="true"></i>
          2020/11/27 18:22:40
        </p>
        
        
        <p class="post-front__desc-category">
          <i class="fa fa-folder-o" aria-hidden="true"></i>
          <a href="/categories/技术">
            技术
          </a>
        </p>
        
          <div class="post-front__desc-tags">
          
          <a href="/tags/http">
            <i class="fa fa-tag" aria-hidden="true"></i>
            http
          </a>
          
          <a href="/tags/计算机网络">
            <i class="fa fa-tag" aria-hidden="true"></i>
            计算机网络
          </a>
          
        </div>
      </div>
    </div>
    <div class="post-content">
      <nav id="toc" class="toc"><ol><li><a href="#http协议简介">HTTP协议简介</a></li><li><a href="#客户端-服务端模型">客户端-服务端模型</a></li><li><a href="#请求报文与响应报文">请求报文与响应报文</a></li></ol></nav><p>web开发中，无论是前端还是后端，所离不开的东西就是HTTP协议和HTTP相关的东西，今天我们就来聊聊和HTTP相关的一些知识。</p>
<h2 id="http协议简介">HTTP协议简介</h2>
<p>HTTP协议全称为超文本传输协议 ，是一个基于TCP的应用层协议，主要是用来规定客户端和服务端的数据传输格式，从名称就可以清楚的了解到最初这是一个用来传输HTML（超文本标记语言）文件的协议，随着互联网的发展，它现在已经可以传输其他各类文件（例如图片、视频等）。</p>
<p>HTTP协议工作于客户端-服务端模型架构上，因此我们要先来了解一下客户端-服务端模型。</p>
<h2 id="客户端-服务端模型">客户端-服务端模型</h2>
<p><img src="https://cdn.jsdelivr.net/gh/xmy6364/blog-image/img/httpabout.png" alt=""></p>
<p>客户端在硬件层面通常指的是电脑、手机等设备，而在软件层面则指的是浏览器等应用程序。现在我们在自己的电脑上也就是客户端电脑上打开浏览器，接着我们在地址栏里输入www.bilibili.com访问b站，这时候浏览器就会加载出来b站首页。在这段过程中，浏览器必然进行了一段十分复杂的操作，要想理解这段操作，首先我们要先认识几个概念。</p>
<p><strong>域名、IP地址、端口、服务器</strong></p>
<p>首先是www.bilibili.com它到底是什么？从专业角度来讲，这串字符串的名字叫域名，在互联网中绝大多数的网站都有自己的域名，并且这个域名是唯一的。互联网中的每一个域名都映射了一个IP地址（<code>ping www.bilibili.com</code>），IP地址是互联网上的每一台主机或者说是服务器都具备的逻辑地址，它具有统一的格式，目前世界上有IPv4和IPv6两种版本，IPv4是一个32位的二进制数，通常被分割为4个8位二进制数，不过我们一般用十进制来表示（比如：192.168.51.2）。2019年11月26日，IPv4地址已经被分配完毕，现在各国都已经开始部署IPv6地址。IP地址中除了主要的四个数字，还有一个使用冒号分割出来的数字，这个数字叫做端口号，它是用来区分各个不同服务的编号，通常我们在浏览器地址栏中很少见到端口号，是因为http请求的默认端口号就是80，大部分企业也会把自己的网站挂载到80端口上。</p>
<p>我们通俗的来理解一下域名、IP地址、端口、主机之间的关系，如果把互联网当作一张大地图，各台主机当作地图上的各个小区或者是建筑，这样IP地址就相当于各个小区或者是建筑的地址，比如咱学校的地址：文明大道265号，而域名就相当于文明大道265号这个地址的名字——安阳师范学院老校区。所以，域名实际上的作用就是为了取代冗长的IP地址，方便我们记忆。如果我们把不同的院系比作不同的服务，那么端口号就相当于软件学院的教学楼或者是互联网+应用技术学院的科技楼。</p>
<p>了解了这几个概念后，我们就要看看浏览器在我们输入网址按下回车后究竟干了什么。</p>
<p><strong>发送到DNS</strong></p>
<p>首先，我们现在都清楚，www.bilibili.com这个域名它映射了一个IP地址，但实际上无论是我们的电脑还是浏览器都不知道这个IP地址是什么，因为域名所绑定的IP地址是有可能更改的。因此当我们访问b站的时候，浏览器会将我们想要访问b站的这个消息根据HTTP协议封装成一个叫请求报文的东西，并将这个请求报文发送到域名解析服务器上，这个域名解析服务器就是我们常说的DNS，在这个DNS上有一个表，里面存储了许多域名及其对应的IP地址。请求报文发送到DNS后，DNS会解析出请求报文中的域名，然后根据域名找出其对应的IP地址，但是DNS的容量是有限的，因此一台DNS不可能存储所有的域名信息，当在这台DNS中找不到对应的IP地址时，当前DNS会将当前请求向上一级的DNS发送过去，逐级解析，直到找到对应的IP地址。</p>
<p><strong>发送到目标服务器</strong></p>
<p>找到域名对应的IP地址后，DNS就会将请求报文转发到目标服务器电脑上的服务器软件上（比如：IIS、Apache），服务器接收并解析请求报文后，会将请求报文所请求的资源根据HTTP协议打包成一个叫做响应报文的包，发送回发出请求的电脑，因为请求报文中携带有发送请求的电脑的IP地址，所以在响应报文发送时并不需要经过DNS服务器，可以直接送达目标电脑上。</p>
<p><strong>浏览器接收响应</strong></p>
<p>浏览器接收到响应报文后，再根据HTTP协议解析这个响应报文，然后将解析到的数据渲染到浏览器内容区域，这样我们就看到了b站的首页。</p>
<h2 id="请求报文与响应报文">请求报文与响应报文</h2>
<p>前面我们提到了两个东西，请求报文与响应报文，接下来我们来看看请求报文与响应报文长什么样子。（F12）</p>
<p>请求报文与响应报文都主要分成两部分——请求（/响应）头与请求（/响应）正文</p>
<p><strong>请求报文</strong></p>
<ul>
<li>
<p>请求头中通常包含请求方法（GET，POST....），Headers（浏览器类型、主机地址）</p>
</li>
<li>
<p>请求正文中会包含请求的通过body、from等方法传递的参数。</p>
</li>
</ul>
<p><strong>响应报文</strong></p>
<ul>
<li>响应头中主要有响应状态（200，404...），响应类型等</li>
<li>响应正文则一般都是我们所请求的数据。</li>
</ul>

    </div>
    
  </div>

        <footer>
        
  <div class="footer">
  
  <div class="theme">
    博客主题为 <a href="https://github.com/xmy6364/CoinRailgun">CoinRailgun</a> 默认主题
  </div>
  <div class="copyright">
    <span>© 2019-2021 xmy6364.</span>
    <span>Powered by <a href="https://github.com/xmy6364/CoinRailgun">CoinRailgun</a></span>
  </div>
</div>

        </footer>
      </main>
    </div>
  </body>
</html>
